<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" 
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:cc="http://sourceforge.net/projects/jsf-comp"
      xmlns:s="http://jboss.com/products/seam/taglib"
      xml:lang="pt-br" lang="pt-br">

    <head>
        <title>#{bundle.geralApplicationName}</title>
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <link href="../resources/css/stylesheet.css" rel="stylesheet" type="text/css" />

    </head>
    <body>

        <div id="tudo">


            <div class='box'>
                <div class='boxtop'><div></div></div>
                <div class='boxcontent'>
                    <!-- Content goes here -->

                    <h2 class="dest">#{bundle.geralApplicationTitulo}</h2>
                    <h:form>
                        <div id="topo">
                            <div class="styleone">
                                <ul>
                                    <li><a href="principal.htm" title="#{bundle.menuPrincipal}" >#{bundle.menuPrincipal}</a></li>
                                    <li><h:commandLink action="#{TransacaoController.createSetup}" value="Carteira" title="Carteira" class="current"/></li>
                                    <li><h:commandLink action="#{GrupoController.getGrupoJogadores}" value="Grupo" title="Grupo"/></li>
                                    <li><a href="ojogo.htm" title="Sobre o jogo">Sobre o jogo</a></li>
                                    <li><h:commandLink action="#{identity.logout}" value="Sair" title="Sair" /></li>
                                </ul>
                            </div>

                        </div>
                    </h:form>


                    <div id="nav">
                        <h:form id="fColunaDireita">
                            <br/>
                            <ul>
                                <li><a href="principal.htm" title="Principal" >Principal</a></li>
                                <li><h:commandLink action="#{GrupoController.getGrupoJogadores}" immediate="true" value="#{bundle.menuGrupo}" /></li>
                                <li><a href="ojogo.htm" title="Sobre o jogo">Sobre o jogo</a></li>
                            </ul>
                            <br/>
                            <a4j:commandLink
                                ajaxSingle="true"
                                value="Compra Ação"
                                title="Compra Ação"
                                reRender="tpAcao, opAcoes"
                                oncomplete="Richfaces.showModalPanel('mpComprarAcao', {});" />
                            <br/>
                            <a4j:commandLink
                                ajaxSingle="true"
                                value="Vender Ação"
                                title="Vender Ação"
                                reRender="tpAcao"
                                oncomplete="Richfaces.showModalPanel('mpVenderAcao',{});" />

                        </h:form>
                        <!-- PAINEL DE COMPRAS DE AÇÕES -->
                        <rich:modalPanel id="mpComprarAcao" minHeight="250" minWidth="450"
                                         height="200" width="500" zindex="2000">
                            <f:facet name="header">
                                <h:outputText value="Comprar Ações" />
                            </f:facet>

                            <f:facet name="controls">
                                <h:panelGroup >
                                    <h:graphicImage value="/resources/images/panelClose.png" style="cursor:pointer" id="BarraCompra" />
                                    <rich:componentControl for="mpComprarAcao" attachTo="BarraCompra" operation="hide" event="onclick" />
                                </h:panelGroup>
                            </f:facet>

                            <a4j:form id="fCompraAcao">
                                <a4j:loadScript  type="text/javascript" src="/resources/scripts/jquery.maskedinput-1.1.4.js" />
                                <center>
                                    <rich:messages layout="table"
                                                   errorClass="errorClass"
                                                   infoClass="infoClass"
                                                   warnClass="warnClass"
                                                   styleClass="painelMensagem"
                                                   ajaxRendered="true" />
                                </center>

                                <h:panelGrid style="text-align:left;" cellpadding="2" cellspacing="2" columns="2" columnClasses="field-names, fields">
                                    <h:outputLabel for="DataTransacaoCompra">
                                        <h:outputText value="Data transacao: " />
                                    </h:outputLabel>

                                    <h:panelGroup>
                                        <h:inputText value="#{TransacaoController.transacao.dataTransacao}" readonly="true" size="8">
                                            <f:convertDateTime type="date" pattern="dd/MM/yyyy" timeZone="America/Sao_Paulo"/>
                                        </h:inputText>

                                        <rich:spacer width="104"/>
                                        <h:outputText value="Saldo do grupo: "/>

                                        <h:outputLabel for="Saldo" >
                                            <h:outputText value="#{TransacaoController.transacao.grupo.saldo}"/>
                                        </h:outputLabel>

                                    </h:panelGroup>

                                    <h:outputLabel for="somAcaoCompra">
                                        <h:outputText value="Ação/Empresa" />
                                    </h:outputLabel>

                                    <h:panelGroup>
                                        <h:selectOneMenu id="somAcaoCompra" value="#{TransacaoController.acaoSelecionada}">
                                            <f:selectItems value="#{TransacaoController.listaAcoes}" />
                                            <a4j:support event="onchange" action="#{TransacaoController.atualizarCotacao}" ajaxSingle="true" limitToList="true" reRender="valor" />
                                        </h:selectOneMenu>

                                        <rich:spacer width="40" />
                                        <h:outputLabel for="CotacaoAcaoSelecionado">
                                            <h:outputText value="Cotacao: " />
                                        </h:outputLabel>

                                        <h:inputText id="valor" value="#{TransacaoController.valor}" readonly="true" size="10" >

                                        </h:inputText>

                                    </h:panelGroup>
                                    <h:outputLabel for="ValorCompra">
                                        <h:outputText value="Valor da compra: " />

                                    </h:outputLabel>
                                    <h:inputText id="ValorCompra" value="#{TransacaoController.valorCompra}" label="Valor da compra: " size="5" />

                                    <h:outputLabel value=" ou " /><br/>

                                    <h:outputLabel for="QuantidadeAcao">
                                        <h:outputText value="Quantidade de ações: " />
                                    </h:outputLabel>

                                    <h:inputText id="QuantidadeAcao" value="#{TransacaoController.quantidadeCompra}" label="Quantidade de ações" size="5"/>


                                </h:panelGrid>
                                <br/>
                                <h:commandButton action="#{TransacaoController.comprarAcao}"
                                                 style="text-align:left;"
                                                 value="Salvar"
                                                 title="Salvar"
                                                 reRender="opAcoes"/>

                                <h:commandButton style="text-align:left;" value="Cancelar"
                                                 title="Cancelar"
                                                 reRender="opAcoes"/>

                            </a4j:form>
                            <br/><br/><br/>
                        </rich:modalPanel>
                        <!-- FIM DO PAINEL DE COMPRAS DE AÇÕES -->

                        <!-- PAINEL DE VENDAS DE AÇÕES -->
                        <rich:modalPanel id="mpVenderAcao" minHeight="250" minWidth="450"
                                         height="200" width="500" zindex="2000">
                            <f:facet name="header">
                                <h:outputText value="Vender Ações" />
                            </f:facet>

                            <f:facet name="controls">
                                <h:panelGroup>
                                    <h:graphicImage value="/resources/images/panelClose.png" style="cursor:pointer" id="BarraVenda" />
                                    <rich:componentControl for="mpVenderAcao" attachTo="BarraVenda" operation="hide" event="onclick" />
                                </h:panelGroup>
                            </f:facet>

                            <a4j:form id="fVendaAcao">
                                <a4j:loadScript  type="text/javascript" src="/resources/scripts/jquery.maskedinput-1.1.4.js" />
                                <center>
                                    <rich:messages layout="table"
                                                   errorClass="errorClass"
                                                   infoClass="infoClass"
                                                   warnClass="warnClass"
                                                   styleClass="painelMensagem"
                                                   ajaxRendered="true" />
                                </center>

                                <h:panelGrid style="text-align:left;" cellpadding="2" cellspacing="2" columns="2" columnClasses="field-names, fields">

                                    <h:outputLabel for="DataTransacaoVenda">
                                        <h:outputText value="Data transacao: " />
                                    </h:outputLabel>

                                    <h:panelGroup>
                                        <h:inputText value="#{TransacaoController.transacao.dataTransacao}" readonly="true" size="8">
                                            <f:convertDateTime type="date" pattern="dd/MM/yyyy" timeZone="America/Sao_Paulo"/>
                                        </h:inputText>


                                        <!--<rich:calendar id="DataTransacaoVenda" label="Data transação: " inputClass="inputCalendar" datePattern="dd/MM/yyyy" popup="true" />-->
                                        <rich:spacer width="50"/>
                                        <h:outputText value="Saldo do grupo: "/>

                                        <h:outputLabel for="Saldo" >
                                            <h:outputText value="#{GrupoController.grupo.saldo}"/>
                                        </h:outputLabel>

                                    </h:panelGroup>

                                    <h:outputLabel for="somAcaoVenda">
                                        <h:outputText value="Ação/Empresa" />
                                    </h:outputLabel>

                                    <h:selectOneMenu id="somAcaoVenda" value="#{TransacaoController.acaoSelecionada}">
                                        <s:selectItems value="#{TransacaoController.listaAcoesGrupo}" var="ag" label="#{ag.acao.nome}" itemValue="#{ag.acao.codAcao}" noSelectionLabel="..."/>
                                    </h:selectOneMenu>

                                    <h:outputLabel for="ValorVenda">
                                        <h:outputText value="Valor da venda: " />

                                    </h:outputLabel>
                                    <h:inputText id="ValorVenda" label="Valor da venda: " size="5" />

                                    <h:outputLabel value=" ou " /><br/>

                                    <h:outputLabel for="QuantidadeAcaoVenda">
                                        <h:outputText value="Quantidade de ações: " />
                                    </h:outputLabel>

                                    <h:inputText id="QuantidadeAcaoVenda" label="Quantidade de ações" size="5"/>

                                </h:panelGrid>
                                <br/>
                                <h:commandButton style="text-align:left;"
                                                 value="Salvar"
                                                 title="Salvar"
                                                 reRender="opAcoes"/>

                                <h:commandButton style="text-align:left;" value="Cancelar"
                                                 title="Cancelar"
                                                 reRender="opAcoes"/>
                            </a4j:form>
                        </rich:modalPanel>
                        <!-- FIM DO PAINEL DE VENDAS DE AÇÕES -->
                    </div>



                    <div id="principal">
                        <h2>Carteira</h2>
                        <h:form>
                            <p>Todos as ações que foram compradas pelo grupo, estão listadas aqui.</p>
                            <a4j:outputPanel id="opAcoes">
                                <rich:dataTable value="#{acoes}" var="a"
                                                id="dtAcoes"
                                                width="100%"
                                                rows="10" sortMode="single"
                                                cellpadding="2" cellspacing="2"
                                                columnClasses="colunaCentralizada, colunaEsquerda"
                                                onRowMouseOver="this.style.backgroundColor='#EFF7FF'"
                                                onRowMouseOut="this.style.backgroundColor='#{a4jSkin.tableBackgroundColor}'"
                                                rendered="#{acoes.size gt 0}">

                                    <rich:column>
                                        <f:facet name="header">
                                            Data compra
                                        </f:facet>
                                        <h:outputText value="#{a.dataTransacao}" >
                                            <f:convertDateTime type="date" pattern="dd/MM/yyyy" />
                                        </h:outputText>
                                    </rich:column>

                                    <rich:column>
                                        <f:facet name="header">
                                            Ação/Empresa
                                        </f:facet>

                                        #{a.acao.nome} / #{a.acao.empresa.nome}
                                    </rich:column>

                                    <rich:column>
                                        <f:facet name="header">
                                            Ultima transação
                                        </f:facet>
                                    </rich:column>

                                    <rich:column>
                                        <f:facet name="header">
                                            Percentual
                                        </f:facet>
                                        <h:outputText value="#{c.percentual}" styleClass="#{c.percentual gt 0 ? 'acaoPositiva' : 'acaoNegativa'}"/>
                                    </rich:column>

                                    <f:facet name="footer">
                                        <rich:datascroller id="dsAcao" for="dtAcoes"/>
                                    </f:facet>
                                </rich:dataTable>
                            </a4j:outputPanel>
                        </h:form>

                        <s:label styleClass="#{invalid?'msgErro':''}">
                            <ui:insert name="label"/>
                            <s:span styleClass="required" rendered="#{required}">*</s:span>
                        </s:label>

                        <span class="#{invalid?'msgErro':''}">
                            <s:validateAll>
                                <ui:insert name="Input"/>
                            </s:validateAll>

                        </span>

                        <s:message styleClass="msgErro"/>


                        <h:form>
                            <s:validateAll>



                            </s:validateAll>
                        </h:form>

                        <br/>
                        <br/>
                        <br/><br/>
                        <br/>
                        <br/>
                        <br/>
                        <br/>
                        <br/>
                        <br/><br/><br/><br/><br/><br/><br/><br/><br/>



                    </div>

                    <div id="apoio">
                        <center><h3>#{bundle.geralIndiceAcoes}</h3></center>

                        <h:form>
                            <s:validateAll>

                                <rich:dataTable id="dtCotacao" var="c"
                                                value="#{cotacaoDM}"
                                                rows="12" sortMode="single"
                                                cellpadding="0" cellspacing="2"
                                                columnClasses="colunaEsquerda, colunaCentralizada, colunaCentralizada"
                                                columnsWidth="100, 30, 30">

                                    <rich:column sortBy="#{c.acao.empresa.nome}">
                                        <f:facet name="header">
                                            Empresa
                                        </f:facet>
                                        #{c.acao.empresa.nome}
                                    </rich:column>

                                    <rich:column sortBy="#{c.acao.nome}">
                                        <f:facet name="header">
                                            Prefixo
                                        </f:facet>
                                        #{c.acao.nome}
                                    </rich:column>


                                    <rich:column sortBy="#{c.percentual}">
                                        <f:facet name="header">
                                            Cotacao
                                        </f:facet>
                                        <h:outputText value="#{c.percentual}" styleClass="#{c.percentual gt 0 ? 'acaoPositiva' : 'acaoNegativa'}"/>

                                    </rich:column>


                                    <f:facet name="footer">
                                        <rich:datascroller id="dsCotacao" for="dtCotacao"/>
                                    </f:facet>
                                </rich:dataTable>
                            </s:validateAll>
                        </h:form>
                        <br/>

                    </div>

                    <div id="rodape">
                        <p>#{bundle.geralApplicationRodape}</p>

                    </div>

                </div>
            </div>
            <div class='boxbottom'><div></div></div>
        </div>
    </body>
</html>
